@import "_animation.less";
.box(){
    display:-webkit-box;
    display:-moz-box;
    display:box;
}
.box-align(@arg){
    -webkit-box-align: @arg;
    -moz-box-align: @arg;
    box-align: @arg;
    
}
.box-pack(@arg){
-webkit-box-pack: @arg;
    -moz-box-pack: @arg;
    box-pack: @arg;
}
.box-orient(@arg){
    -webkit-box-orient: @arg;
    -moz-box-orient: @arg;
    box-orient: @arg;
}
.box-flex(@arg){
    -moz-box-flex: @arg;
    -webkit-box-flex: @arg;
    box-flex: @arg;   
}


//flex
.flex(@arg){
    -moz-box-flex: @arg;
    -webkit-box-flex: @arg;
    -o-box-flex: @arg;
    -ms-flex: @arg;
    flex: @arg;
}
.flexbox(){
    display: -webkit-box;
    display: -moz-box;
    display: -o-box;
    display: -ms-flexbox;
    display: flex;
}
//垂直水平居中
.horizontal(){
    .box();
    .pre(box-orient,horizontal);
    .pre(box-align,center);
    .pre(box-pack,center);
}
//水平居中
.horizontalA(){
    .box();
    .pre(box-orient,horizontal);
    .pre(box-align,center);
    // .pre(box-pack,center);
}
//垂直居中
.horizontalB(){
    .box();
    .pre(box-orient,horizontal);
    // .pre(box-align,center);
    .pre(box-pack,center);
}

//columns 多列布局
.columns(@args) {
    .pre(columns,@arg);
}
.column-count(@count) {
    .pre(column-count,@arg);
}
.column-gap(@gap) {
    .pre(column-gap,@arg);
}
.column-width(@width) {
    .pre(column-width,@arg);
}
.column-rule(@args) {
    .pre(column-rule,@arg);
}
